<template>
    <div class="logo">
        <img :src="setting.logo" alt="" v-if="setting.logoHidden">
        <p>{{ setting.title }}</p>
    </div>
</template>

<script setup lang='ts' name="Logo">
import setting from "@/setting"
</script>

<style scoped lang='scss'>
.logo {
    height: $base-menu-logo-height;
    width: 100%;
    color: white;
    display: flex;
    align-items: center;
    padding: 10px;

    img {
        max-width: 100%;
        width: 100px;
        height: 50px;

    }

    p {
        font-size: $base-logo-title-fontSize;
        margin-left: 10px;
    }
}
</style>